<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<div th:replace="blog/yummy-jekyll/header::header('博客列表','My Blog')"></div>
<body>
<div class="content">
    <section class="jumbotron geopattern">
        <div class="container">
            <div id="jumbotron-meta-info">
                <h1>文章</h1>
                <br>
                <span class="meta-info">
                        <span class="mega-octicon octicon-list-unordered">
                            &nbsp;&nbsp;<th:block th:text="|${pageName}页|"></th:block>
                        </span>
                </span>
            </div>
        </div>
    </section>
    <article class="post container">
        <div class="row">
            <div class="col-md-10">
                <!-- Blog list -->
                <ul id="posts-list">
                    <th:block th:if="${page}">
                        <th:block th:if="${page.getRecords().size() == 0}"><h2>空空如也~~</h2></th:block>
                        <th:block th:each="blog : ${page.getRecords()}">
                            <li class="posts-list-item">
                                <div class="posts-content">
                                    <span class="posts-list-meta"
                                          th:text="${#dates.format(blog.getCreateTime(), 'yyyy-MM-dd')}">2019-01-01</span>
                                    <a class="posts-list-name bubble-float-left" th:href="@{'/blog/' + ${blog.getId()}}">
                                        <th:block th:text="${blog.getTitle()}"></th:block>
                                    </a>
                                    <span class="circle"></span>
                                </div>
                            </li>
                        </th:block>
                    </th:block>
                </ul>
                <!-- 底部分页栏 -->
                <th:block th:if="${null != page}">
                    <ul class="pagination text-align">
                        <li th:class="${page.getCurrent()==1}?'disabled' : ''"><a
                                th:href="@{${page.getCurrent()==1}?'##':'/'+${pageUrl}+'/'+${keyword}+'/' + ${page.getCurrent()-1}}">&laquo;</a>
                        </li>
                        <li th:if="${page.getCurrent()-3 >=1}"><a
                                th:href="@{'/'+${pageUrl}+'/'+${keyword}+'/' + ${page.getCurrent()-3}}"
                                th:text="${page.getCurrent() -3}">1</a></li>
                        <li th:if="${page.getCurrent()-2 >=1}"><a
                                th:href="@{'/'+${pageUrl}+'/'+${keyword}+'/' + ${page.getCurrent()-2}}"
                                th:text="${page.getCurrent() -2}">1</a></li>
                        <li th:if="${page.getCurrent()-1 >=1}"><a
                                th:href="@{'/'+${pageUrl}+'/'+${keyword}+'/' + ${page.getCurrent()-1}}"
                                th:text="${page.getCurrent() -1}">1</a></li>
                        <li class="active"><a href="#" th:text="${page.getCurrent()}">1</a></li>
                        <li th:if="${page.getCurrent()+1 <=page.getTotal()}"><a
                                th:href="@{'/'+${pageUrl}+'/'+${keyword}+'/' + ${page.getCurrent()+1}}"
                                th:text="${page.getCurrent() +1}">1</a></li>
                        <li th:if="${page.getCurrent()+2 <=page.getTotal()}"><a
                                th:href="@{'/'+${pageUrl}+'/'+${keyword}+'/' + ${page.getCurrent()+2}}"
                                th:text="${page.getCurrent() +2}">1</a></li>
                        <li th:if="${page.getCurrent()+3 <=page.getTotal()}"><a
                                th:href="@{'/'+${pageUrl}+'/'+${keyword}+'/' + ${page.getCurrent()+3}}"
                                th:text="${page.getCurrent() +3}">1</a></li>
                        <li th:class="${page.getCurrent()==page.getTotal()}?'disabled' : ''"><a
                                th:href="@{${page.getCurrent()==page.getTotal()}?'##' : '/'+${pageUrl}+'/'+${keyword}+'/' + ${page.getCurrent()+1}}">&raquo;</a>
                        </li>
                    </ul>
                </th:block>
            </div>
        </div>
    </article>
</div>
</body>
<div th:replace="blog/yummy-jekyll/footer::footer"></div>
</html>